import React,{Component} from 'react'
import {StyleSheet,View,Text,Image,ScrollView} from 'react-native'
import {PropTypes} from 'prop-types';
import px from '../util/px'
import ModuleTitle from './ModuleTitle'
export default function ScrollViewModule({title,dataList}){
    return(
        <View  style={{backgroundColor:'#ffffff',paddingTop:px(32)}}>
            <ModuleTitle title={title}/> 
            <ScrollView 
            horizontal={true}
            alwaysBounceVertical={false}
            showsHorizontalScrollIndicator={false}
            style={{padding:px(32)}}
            >
               {dataList.map((item,index)=><View 
               key={item.id}
               style={{paddingRight:px(32)}}>
                     <Image
                     style={{width:px(210),height:px(280)}}
                     source={{uri:item.imgUrl}}/>
                     <Text style={{marginTop:px(16),marginBottom:px(4),fontSize:12,color:"#000000"}}>{item.title}</Text>
                     <Text style={{fontSize:12,color:"#333333"}}>{item.author}</Text>
                 </View>)}
            </ScrollView>
        </View>
    )
}